<html>
<!-- -------------------------------------------------------------- -->
<!-- ####    ##   ####  #####    #    # ##### #####   ##   #        -->
<!-- #   #  #  #  #   # #        ##  ## #       #    #  #  #        -->
<!-- ####  #    # #   # ####     # ## # ####    #   #    # #        -->
<!-- #   # ###### ####  #        #    # #       #   ###### #        -->
<!-- #   # #    # #  #  #        #    # #       #   #    # #        -->
<!-- ####  #    # #   # #####    #    # #####   #   #    # #####    -->
<!-- -------------------------------------------------------------- -->
<!-- -------------------------------------------------------------- -->
<!-- BARE METAL theme                                               -->
<!-- -------------------------------------------------------------- -->
<!-- EXTREMELY bare bones theme. designed for photo blogs but       -->
<!-- should work with all blog types.                               -->
<!-- some stuff borrowed from the optica and redux themes.          -->
<!-- -------------------------------------------------------------- -->
<head>
    <link rel="shortcut icon" href="{Favicon}">
    <link rel="alternate" type="application/rss+xml" href="{RSS}">

    <title>
        {Title}
        {block:SearchPage}
            ({lang:Search results for SearchQuery})
        {/block:SearchPage}
        {block:PermalinkPage}
            {block:PostSummary}
                    —
                {PostSummary}
            {/block:PostSummary}
        {/block:PermalinkPage}
    </title>

    <style>
        body {
            padding: 1em;
            font-family: {font:Body}, "Helvetica Neue", HelveticaNeue, Arial, sans-serif;
            font-size: 1em;
            color: {color:Text};
            background-color: {BackgroundColor};
            {block:IfShowBackgroundImage}
            background-image: url('{image:Background}');
            {block:IfShowBackgroundImage}
        }
        div.headerImage, div.description, div.title {
            display: block; /* centering */
            margin-left: auto; /* centering */
            margin-right: auto; /* centering */
            text-align: center;
        }
        div.description {
            padding-bottom: 2ex;
        }
        h1 {
            font-family: {TitleFont}, "Helvetica Neue", HelveticaNeue, Arial, sans-serif;
            font-weight: {TitleFontWeight};
        }
        h1 a {
            text-decoration: none;
            color: {TitleColor};
        }
        a {
            color: {AccentColor};
        }
        a img {
            border-style: none;
        }
        aside.sidebar {
            border: 1px solid {color:Post Border};
            position: absolute;
            right: 0;
            font-size: 85%;
            padding: 0.5em;
        }
        div.followingOuter {
            margin-top: 1.5ex;
            padding: 0.5em;
            background-color: {color:Following Background}
        }
        div.followingInner {
            margin: auto;
            margin-top: 1ex;
            -moz-column-count: 3;
            column-count: 3;
            -moz-column-width: 42px;
            column-width: 42px;
        }

        /*
        {block:IfCenteredPosts}
        div.post, div.title {
            width: 502px;
            margin-left: auto;
            margin-right: auto;
        }
        div.title {
            text-align: center;
        }
        {/block:IfCenteredPosts}
        */

        section.posts {
            position: relative;
        }
        div.postInner {
            margin-bottom: 1ex;
        }
        div.postOuter {
            /*display: inline-block;*/
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            width: 520px;
            /* top, right, bottom, left */
            padding: 0.5em 0.5em 0.25em 0.5em;
            margin-bottom: 2ex;
            border: 1px solid {color:Post Border};
            background-color: {color:Post Background};
            box-shadow: 4px 4px 4px hsla(0, 0%, 0%, 0.36);
        }
        div.caption {
            background-color: {color:Caption Background};
        }
        div.caption p {
            border: 0px;
            margin: 0px;
            padding: 0px;
            display: inline-block;
        }
        /* tumblr's html */
        div.like_button {
             float: left;
        }
        /* tumblr's html */
        a.reblog_button {
             float: left;
        }
        div.likeReblogNoteDate {
            padding-top: 0.125ex;
            background-color: {color:Post Like And Reblog Background};
        }
        div.tags {
            background-color: {color:Post Tags Background};
        }
        a.reblog_button,
        div.like_button,
        span.highRes,
        span.previousPost,
        span.noteCount,
        span.postedDate,
        span.footerItem  {
            margin-right: 1em;
        }
        div.clickThroughLink, div.likeReblogNoteDate, div.rebloggedFrom, div.tags {
            font-size: 85%;
        }
        div.rebloggedFrom {
            padding-bottom: 1ex;
            background-color: {color:Post Reblogged From Background}
        }
        div.postNotes,
        div.permalinkPagination,
        div.pagination,
        div.footerLinks,
        div.tags {
            /* border-bottom: 1px dotted hsl(0, 0%, 90%); */
            padding-top: 0.5ex;
            padding-bottom: 0.5ex;
        }
        div.pagination, div.permalinkPagination {
            width: 520px;
            background-color: {color:Pagination Background}
        }
        .clearfix:after {
            content: ".";
            visibility: hidden;
            display: block;
            height: 0;
            clear: both;
            overflow: auto;
        }

        /* ol.notes and li.note only show up on the permalink page */
        ol.notes {
            list-style-type: none;
            padding: 0px;
            margin: 0px;
        }
        li.note {
            padding: 0px;
            margin: 0px;
            font-family: {font:Notes};
            font-size: 85%;
        }

        {CustomCSS}
    </style>

    {block:Description}
    <meta
        name="description"
        content="{MetaDescription}"
    />
    {/block:Description}

    {block:Hidden}
    <meta
        name="color:Background"
        content="#eee"
    />
    <meta
        name="color:Post Background"
        content="#fff"
    />
    <meta
        name="color:Caption Background"
        content="#fff"
    />
    <meta
        name="color:Post Like And Reblog Background"
        content="#fff"
    />
    <meta
        name="color:Post Border"
        content="#000"
    />
    <meta
        name="color:Post Reblogged From Background"
        content="#fff"
    />
    <meta
        name="color:Post Tags Background"
        content="#fff"
    />
    <meta
        name="color:Following Background"
        content="#ddd"
    />
    <meta
        name="color:Pagination Background"
        content="#ddd"
    />
    <meta
        name="color:Text"
        content="#000"
    />
    <meta
        name="image:Background"
        content="https://secure.assets.tumblr.com/images/logo_page/img_logotype_grey_2x.png"
    />
    <meta
        name="font:Body"
        content="Gibson"
    />
    <meta
        name="font:Notes"
        content="Gibson"
    />
    <meta
        name="if:Show captions"
        content="1"
    />
    <meta
        name="if:Show tags"
        content="1"
    />
    <meta
        name="if:Show reblogged from"
        content="1"
    />
    <meta
        name="if:Show click through link"
        content="1"
    />
    <meta
        name="if:Show background image"
        content="0"
    />
    <meta
        name="if:Show people I follow"
        content="1"
    />
    <!--
    <meta
        name="if:Centered posts"
        content="0"
    />
    -->
    {/block:Hidden}
</head>
<body>
    <section class="page">
        <header class="header">
            {block:ShowHeaderImage}
                {block:IndexPage}
                <div class="headerImage">
                    <img
                        src="{HeaderImage}"
                        height="128"
                    />
                </div>
                {/block:IndexPage}
            {/block:ShowHeaderImage}

            {block:ShowTitle}
            <div class="title">
                <h1>
                    <a class="title" href="{BlogURL}">{Title}</a>
                </h1>
            </div>
            {/block:ShowTitle}

            {block:ShowDescription}
                {block:IndexPage}
                <div class="description">
                    {Description}
                </div>
                {/block:IndexPage}
            {/block:ShowDescription}
        </header>

        <section class="posts">
            <aside class="sidebar">
                <div class="sidebarItem archive">
                    <a href="/archive">{lang:Archive}</a>
                </div>

                {block:Likes}
                <span class="sidebarItem likes">
                    <a href="http://www.tumblr.com/liked/by/{Name}">
                        {lang:Likes}
                    </a>
                </span>
                {/block:Likes}

                <div class="sidebarItem rss">
                    <a href="{RSS}">{lang:Get the RSS}</a>
                </div>

                <div class="sidebarItem mobile">
                    <a href="{BlogURL}/mobile">{lang:Mobile version}</a>
                </div>

                {block:IfShowPeopleIFollow}
                    {block:Following}
                    <div class="sidebarItem followingOuter">
                        {lang:Following}:
                        <div class="sidebarItem followingInner">
                            {block:Followed}
                            <a href="{FollowedURL}" alt="{FollowedTitle}"><img src="{FollowedPortraitURL-40}"/></a>
                            {/block:Followed}
                        </div>
                    </div>
                    {/block:Following}
                {/block:IfShowPeopleIFollow}
            </aside>

            {block:Posts}
                <div class="postOuter" id="#{PostID}"> <!-- clearfix -->
                    <section class="postContent"">
                        {block:Text}
                        <div class="postInner text">
                            {block:Title}
                            <h3><a href="{Permalink}">{Title}</a></h3>
                            {/block:Title}
                            {Body}
                        </div>
                        {/block:Text}

                        {block:Photo}
                        <div class="postInner photoImg">
                            {block:IndexPage}
                            <a href="{Permalink}" title="perma link"><img
                                src="{PhotoURL-500}"
                                alt="{PhotoAlt}"
                            /></a>
                            {/block:IndexPage}
                            <!-- no link on the permalink page -->
                            {block:PermalinkPage}
                            <img
                                src="{PhotoURL-500}"
                                alt="{PhotoAlt}"
                            />
                            {/block:PermalinkPage}

                            {block:IfShowClickThroughLink}
                                {block:LinkURL}
                                <div class="clickThroughLink">
                                    Click through link: <a href="{LinkURL}">{LinkURL}</a>
                                </div>
                                {/block:LinkURL}
                            {/block:IfShowClickThroughLink}
                        </div>
                        {/block:Photo}

                        {block:Panorama}
                        <div class="postInner panorama">
                            {LinkOpenTag}
                            <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>
                            {LinkCloseTag}
                        </div>
                        {/block:Panorama}

                        {block:Photoset}
                        <div class="postInner photoset">
                            {Photoset-500}
                        </div>
                        {/block:Photoset}

                        {block:Quote}
                        <div class="postInner quote">
                            "{Quote}"

                            {block:Source}
                            <div class="source">{Source}</div>
                            {/block:Source}
                        </div>
                        {/block:Quote}

                        {block:Link}
                        <div class="postInner link">
                            <a href="{URL}" class="link" {Target}>{Name}</a>

                            {block:Description}
                            <div class="description">{Description}</div>
                            {/block:Description}
                        </div>
                        {/block:Link}

                        {block:Chat}
                        <div class="postInner chat">
                            {block:Title}
                            <h3><a href="{Permalink}">{Title}</a></h3>
                            {/block:Title}

                            <ul class="chat">
                                {block:Lines}
                                <li class="{Alt} user_{UserNumber}">
                                    {block:Label}
                                        <span class="label">{Label}</span>
                                    {/block:Label}{Line}
                                </li>
                                {/block:Lines}
                            </ul>
                        </div>
                        {/block:Chat}

                        {block:Video}
                        <div class="postInner video">
                            {Video-500}
                        </div>
                        {/block:Video}

                        {block:Audio}
                        <div class="postInner audio">
                            {AudioEmbed}
                        </div>
                        {/block:Audio}
                    </section> <!-- class="postContent" -->

                    {block:IfShowCaptions}
                        {block:Caption}
                        <div class="caption">{Plaintext Caption}</div>
                        {/block:Caption}
                    {/block:IfShowCaptions}

                    <!-- needs clearfix otherwise following div is indented. -->
                    <div class="likeReblogNoteDate clearfix">
                        {LikeButton} {ReblogButton}

                        {block:HighRes}
                        <span class="highRes"><a href="{PhotoURL-HighRes}">{lang:High-res photo}</a></span>
                        {/block:HighRes}

                        {block:NoteCount}
                        <span class="noteCount">
                            <a href="{Permalink}" title="perma link">{NoteCountWithLabel}.</a>
                        </span>
                        {/block:NoteCount}

                        {block:Date}
                        <span class="postedDate">
                            {lang:Posted TimeAgo}, {ShortDayOfWeek}, {ShortMonth} {DayOfMonth} {Year}.
                        </span>
                        {/block:Date}
                    </div>

                    {block:IfShowTags}
                        {block:HasTags}
                        <div class="tags">
                            {lang:Tags}
                            {block:Tags}
                            <a href="{TagURL}">{Tag}</a>
                            {/block:Tags}
                        </div>
                        {/block:HasTags}
                    {/block:IfShowTags}

                    {block:IfShowRebloggedFrom}
                        {block:RebloggedFrom}
                        <div class="rebloggedFrom">
                            {lang:Reblogged from ReblogParentName 2}.
                            {lang:Originally from ReblogRootName 2}.
                        </div>
                        {/block:RebloggedFrom}
                    {/block:IfShowRebloggedFrom}

                    {block:PermalinkPage}
                        {block:PostSummary}
                        <div>{PostSummary}</div>
                        {/block:PostSummary}

                        {block:PostNotes}
                        <div class="postNotes">
                            {PostNotes-16}
                        </div>
                        {/block:PostNotes}
                    {/block:PermalinkPage}
                </div> <!-- class="postOuter clearfix" -->

                {block:PermalinkPage}
                    {block:PermalinkPagination}
                    <div class="permalinkPagination">
                        {block:PreviousPost}
                        <span class="previousPost">
                            <a href="{PreviousPost}">{lang:Previous post}</a>
                        </span>
                        {/block:PreviousPost}

                        {block:NextPost}
                        <span class="nextPost">
                            <a href="{NextPost}">{lang:Next post}</a>
                        </span>
                        {/block:NextPost}
                    </div>
                    {/block:PermalinkPagination}
                {/block:PermalinkPage}
            {/block:Posts}
        </section> <!-- class="posts" -->

        <footer class="clearfix">
            {block:IndexPage}
                {block:Pagination}
                <div class="pagination">
                    {block:PreviousPage}
                    <span class="footerItem">
                        <a href="{PreviousPage}">{lang:Previous page}</a>
                    </span>
                    {/block:PreviousPage}

                    <span class="footerItem">
                        {block:JumpPagination length="5"}
                            {block:CurrentPage}
                                {PageNumber}
                            {/block:CurrentPage}
                            {block:JumpPage}
                            <a class="jumpPage" href="{URL}">{PageNumber}</a>
                            {/block:JumpPage}
                        {/block:JumpPagination}
                    </span>

                    {block:NextPage}
                    <span class="footerItem">
                        <a href="{NextPage}">{lang:Next page}</a>
                    </span>
                    {/block:NextPage}
                </div> <!-- class="pagination" -->
                {/block:Pagination}
            {/block:IndexPage}

            <div class="footerLinks">
                <span class="footerItem">
                    <a href="/archive">{lang:Archive}</a>
                </span>

                {block:Likes}
                <span class="footerItem">
                    <a href="http://www.tumblr.com/liked/by/{Name}">
                        {lang:Likes}
                    </a>
                </span>
                {/block:Likes}

                <span class="footerItem">
                    <a href="{RSS}">{lang:Get the RSS}</a>
                </span>

                <span class="footerItem">
                    <a href="{BlogURL}/mobile">{lang:Mobile version}</a>
                </span>

                <span class="footerItem">
                    {CopyrightYears}
                </span>
            </div>
        </footer>
    </section> <!-- class="page" -->
</body>
</html>
